<template>
	<view class="container">
		<!-- #ifdef MP-WEIXIN -->
		<view class="force-login-wrap">
			<!-- <image class="logo-bg" :src="`${$VUE_APP_RESOURCES_URL}/images/logo_bg.png`" mode="aspectFill"></image> -->
			<view class="force-login__content y-f">
				<view class="login-avatar">
					<open-data class="user-avatar" type="userAvatarUrl"></open-data>
					<open-data class="user-name" type="userNickName"></open-data>
				</view>
				<view class="login-notice">为了提供更优质的服务，请先登录。</view>
				<button class="cu-btn author-btn" open-type="getPhoneNumber"
					@getphonenumber="phoneLogin">微信手机号一键登录</button>
				<button class="cu-btn close-btn" @tap="back">暂不登录</button>
			</view>
		</view>
		<!-- #endif -->
		<!-- #ifndef MP-WEIXIN -->
		<view class="force-login-wrap">
			<view class="force-login__content y-f">
				<uni-forms ref="baseForm" :model="information" style="width:80%">
				</uni-forms>
				<view class="login-notice">为了提供更优质的服务，请先登录</view>

				<button class="cu-btn author-btn" @click="toLogin">去登录</button>
			</view>
		</view>
		<!-- #endif -->
	</view>
</template>

<script>
	import {
		url,
		request,
		login
	} from '@/service/api.js'

	export default {
		data() {
			return {
				information: {
					username: '',
					password: '',
				},
				code: '',
				state: '',
				inviteCode: ''
			}
		},
		onLoad(param) {
			console.log('code', param.code)
			console.log('state', param.state)
			this.code = param.code || ''
			this.state = param.state || ''
			this.inviteCode = param.inviteCode || ''
			const that = this
			if (this.code) {
				let param = {
					code: this.code
				}
				request(url.wxH5Auth, 'GET', param).then(res => {
					if (res.status === 200) {
						uni.setStorageSync('auth', res.data.token)
						setTimeout(function() {
							if (res.data.firstVal === 0) {
								uni.navigateTo({
									url: `/pages/register/register?inviteCode=${that.inviteCode}`
								})
							} else {
								uni.switchTab({
									url: '/pages/tabBar/Home/Home'
								});
							}
						}, 50);

					}
				}).catch(err => {
					alert('认证失败！详细错误信息：' +
						JSON.stringify(err))
				})
				// request(`https://api.weixin.qq.com/sns/oauth2/access_token?appid=wxae58dd85239aaeaa&secret=1df8ead518e09885be8dc02a79798b95&code=${this.code}&grant_type=authorization_code`,'get').then(res => {
				// 	alert(res)
				// 	if (res.access_token) {

				// 	}
				// }).catch(err=>{
				// 	alert(JSON.stringify(err))
				// })
			}
		},
		methods: {
			toLogin() {
				window.location.href = this.inviteCode ?
					`https://open.weixin.qq.com/connect/oauth2/authorize?appid=wxae58dd85239aaeaa&redirect_uri=https://app.52yinyuan.com/pages/login/login?inviteCode=${this.inviteCode}&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect` :
					`https://open.weixin.qq.com/connect/oauth2/authorize?appid=wxae58dd85239aaeaa&redirect_uri=https%3A%2F%2Fapp.52yinyuan.com%2Fpages%2Flogin%2Flogin/&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect`
			},
			goToRegister() {
				uni.navigateTo({
					url: '/pages/register/register'
				})
			},
			back() {
				uni.switchTab({
					url: '/pages/tabBar/Home/Home'
				});
			},
			// 微信用户手机号登录
			phoneLogin(e) {
				console.log('用户微信手机号登录')
				if (e.mp.detail.errMsg == 'getPhoneNumber:ok') {
					console.log(e.mp.detail)
					// uni登录
					uni.login({
						provider: 'weixin',
						success: async loginRes => {
							let code = loginRes.code // 获取开发code 
							uni.setStorageSync('wxLoginCode', loginRes.code)
							let param = {
								encryptedData: e.mp.detail.encryptedData,
								iv: e.mp.detail.iv,
								code: code,
							}
							request(url.wxAuth, 'POST', JSON.stringify(param)).then(res => {
								console.log('调用后台接口获取信息')
								consol.log(res);
								if (res.status === 200) {
									uni.hideLoading()
									uni.setStorageSync('auth', res.data.token)
									if (res.firstVal === 0) {
										// 前往注册页面
										uni.navigateTo({
											url: '/pages/register/register'
										})
									} else {
										console.log('登录成功,开始处理登录信息保存，并获取用户详情')
										uni.switchTab({
											url: '/pages/tabBar/Home/Home'
										});
									}
								}
							}).catch(error => {
								console.log('errrrrrrrrr', error)
								console.log('登录接口调用失败')
							})
						}
					})
				} else {
					uni.showToast({
						title: '已拒绝授权',
						icon: 'none',
						duration: 2000,
					})
				}
			},
		},
		mounted() {},
	}
</script>

<style lang="less">
	.container {
		height: 100vh;
		flex: 1;
		display: flex;
		flex-direction: column;
		justify-content: flex-start;
		position: relative;
	}

	.force-login-wrap {
		// overflow: hidden;
		z-index: 11111;
		top: 0;

		.logo-bg {
			width: 640rpx;
			height: 300rpx;
		}

		.tip {
			color: blue;

			margin-bottom: 10px;
		}

		.force-login__content {
			display: flex;
			flex-direction: column;
			align-items: center;
			position: absolute;
			left: 50%;
			top: 35%;
			transform: translate(-50%, -50%);
			width: 100%;
			text-align: center;

			.login-avatar {
				width: 100px;
				// height:100px
				text-align: center;

				.user-avatar {
					border-radius: 50%;
					overflow: hidden;
					margin-bottom: 40rpx;
				}

				.user-name {
					width: 100%;
					text-align: center;
					font-size: 35rpx;
					font-family: PingFang SC;
					font-weight: bold;
					color: #000;
					margin-bottom: 30rpx;
				}
			}

			.login-notice {
				font-size: 28rpx;
				font-family: PingFang SC;
				font-weight: 400;
				color: #000;
				line-height: 44rpx;
				width: 500rpx;
				text-align: center;
				margin: auto;
				margin-bottom: 80rpx;
			}

			.author-btn {
				width: 630rpx;
				height: 80rpx;
				background: linear-gradient(to right, #f35447 0%, #ff8e3c 100%);
				background: -moz-linear-gradient(to right, #f35447 0%, #ff8e3c 100%);
				// box-shadow: 0px 7rpx 6rpx 0px rgba(229, 138, 0, 0.22);
				border-radius: 40rpx;
				font-size: 30rpx;
				font-family: PingFang SC;
				font-weight: 500;
				color: rgba(255, 255, 255, 1);
			}

			.close-btn {
				width: 630rpx;
				height: 80rpx;
				margin-top: 30rpx;
				border-radius: 40rpx;
				border: 2rpx solid #eb3729;
				background: none;
				font-size: 30rpx;
				font-family: PingFang SC;
				font-weight: 500;
				color: #eb3729;
			}
		}
	}
</style>
